import {filterMenu} from '@/utils/authority-utils'
import {cloneDeep} from 'lodash'

const customTitlesStr = sessionStorage.getItem(process.env.VUE_APP_TBAS_TITLES_KEY)
const customTitles = (customTitlesStr && JSON.parse(customTitlesStr)) || []

export default {
    namespaced: true,
    state: {
        isMobile: false,
        pageMinHeight: 0,
        menuData: [],
        activatedFirst: undefined,
        customTitles,
        layout: 'mix',                       //导航布局，可选 side 和 head，分别为侧边导航和顶部导航
        fixedHeader: true,                   //固定头部状态栏，true:固定，false:不固定
        fixedSideBar: true,                   //固定侧边栏，true:固定，false:不固定
        fixedTabs: true,                      //固定页签头，true:固定，false:不固定
        pageWidth: 'fixed',                   //内容区域宽度，fixed:固定宽度，fluid:流式宽度
        multiPage: true,                     //多页签模式，true:开启，false:不开启
        cachePage: true,                      //是否缓存页面数据，仅多页签模式下生效，true 缓存, false 不缓存
        asyncRoutes: false,                   //异步加载路由，true:开启，false:不开启
        showPageTitle: true,                  //是否显示页面标题（PageLayout 布局中的页面标题），true:显示，false:不显示
        filterMenu: true,                    //根据权限过滤菜单，true:过滤，false:不过滤
        animate: {                            //动画设置
            disabled: true,                    //禁用动画，true:禁用，false:启用
            name: 'back',                     //动画效果，支持的动画效果可参考 ./animate.config.js
            direction: 'left'                   //动画方向，切换页面时动画的方向，参考 ./animate.config.js
        },
        theme: {
            mode: 'light'
        },
    },
    getters: {
        menuData(state, getters, rootState) {
            if (state.filterMenu) {
                const {permissions, roles} = rootState.account
                return filterMenu(cloneDeep(state.menuData), permissions, roles)
            }
            return state.menuData
        },
        firstMenu(state) {
            const {menuData} = state
            if (menuData.length > 0 && !menuData[0].fullPath) {
                formatFullPath(menuData)
            }
            return menuData.map(item => {
                const menuItem = {...item}
                delete menuItem.children
                return menuItem
            })
        },
        subMenu(state) {
            const {menuData, activatedFirst} = state
            if (menuData.length > 0 && !menuData[0].fullPath) {
                formatFullPath(menuData)
            }
            const current = menuData.find(menu => menu.fullPath === activatedFirst)
            return current && current.children || []
        }
    },
    mutations: {
        setAnimate(state, animate) {
            state.animate = animate
        },
        correctPageMinHeight(state, minHeight) {
            state.pageMinHeight += minHeight
        },
        setMenuData(state, menuData) {
            state.menuData = menuData
        },
        setAsyncRoutes(state, asyncRoutes) {
            state.asyncRoutes = asyncRoutes
        },
        setActivatedFirst(state, activatedFirst) {
            state.activatedFirst = activatedFirst
        },
        setFixedTabs(state, fixedTabs) {
            state.fixedTabs = fixedTabs
        },
        setCustomTitle(state, {path, title}) {
            if (title) {
                const obj = state.customTitles.find(item => item.path === path)
                if (obj) {
                    obj.title = title
                } else {
                    state.customTitles.push({path, title})
                }
                sessionStorage.setItem(process.env.VUE_APP_TBAS_TITLES_KEY, JSON.stringify(state.customTitles))
            }
        }
    }
}


function formatFullPath(routes, parentPath = '') {
    routes.forEach(route => {
        let isFullPath = route.path.substring(0, 1) === '/'
        route.fullPath = isFullPath ? route.path : (parentPath === '/' ? parentPath + route.path : parentPath + '/' + route.path)
        if (route.children) {
            formatFullPath(route.children, route.fullPath)
        }
    })
}
